<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:th="http://www.thymeleaf.org"
	xmlns:winter="http://www.winter.org"
	xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"
	layout:decorator="/layouts/layout">
	
	<div id="NotaFragment" th:fragment="NotaFragment">
		<winter:output id="NotaOutput">
			<winter:output id="mainNotaOutput">
				<h1>Notas:</h1>
				<div class="cabecera">
					<winter:ajaxsubmit 
						id="@{'NuevoNota'}" 
						form="ControlesForm"
						url="@{'/controles/agregarNota'}" 
						update="SeguimientoModalOutput"
						value="Agregar Nota"
						object="controles"
						showstatus="true"
						class="btn btn-cyan"
						immediate="true"
						oncomplete="@{'Winter.ui.OpenDialog(\'NotaModal\')'}">
					</winter:ajaxsubmit>		
				</div>
				<winter:datatable th:if="${!#lists.empty(controles.control.notas)}"
						id="ListNotas"
						customLanguage="true"
						paginate="true"
						jQuery="true"
						retrieve="true"
						emptyTableText="No se encontraron Datos!"
						infoText="Mostrando _START_ al _END_ de _TOTAL_ registros"
						emptyTableInfoText="Mostrando 0 al 0 de 0 registros"
						searchText="Buscar"
						lengthMenu="Mostrar _MENU_ registros"
						wrapperclass="simpleTable_wrapper">
						<thead>
							<tr>
								<th th:text="#{label.control.nota.id}"></th>
								<th th:text="#{label.control.nota.fecha}"></th>
								<th th:text="#{label.control.nota.texto}"></th>
								<th th:text="#{label.control.nota.usuario}"></th>
								<th th:text="#{label.common.operaciones}"></th>
							</tr>
						</thead>
						<tbody>
							<tr th:each="notaRow, rowStatNota : ${controles.notas}">
								<td th:text="${notaRow.id}"></td>
								<td th:text="${notaRow.fecha}?${#dates.format(notaRow.fecha, 'dd/MM/yyyy HH:mm')}:${notaRow.fecha}"></td>
								<td th:text="${#strings.abbreviate(notaRow.texto,30)}" th:title="${notaRow.texto}"
									style="vertical-align: middle;"></td>
								<td th:text="${notaRow.nombreUsuario}"></td>							
								<td class="tabla-operaciones">
									<div class="button-toolbar" th:if="${notaRow.puedeEditar}">
										<winter:ajaxlink 
											id="@{${rowStatNota.index}+'EditarNota'}" 
											form="ControlesForm"
											url="@{'/controles/editarNota/'+${rowStatNota.index}}" 
											update="NotasModalOutput"
											title="Editar"
											oncomplete="@{'Winter.ui.OpenDialog(\'NotaModal\')'}"
											object="controles"
											class="ajax-submit icon-edit-sign icon-2x"
											showstatus="true">
										</winter:ajaxlink>
										<winter:ajaxlink 
											id="@{${rowStatNota.index}+'EliminarNota'}" 
											form="ControlesForm"
											url="@{'/controles/eliminarNota/'+${rowStatNota.index}}" 
											update="NotaOutput"
											title="Eliminar"
											tip="true"
											object="controles"
											showstatus="true"
											immediate="true"
											class="ajax-submit icon-remove-sign icon-2x"
											confirmationrequired="true"
							                confirmationtext="Está seguro que desea realizar la operación?">
										</winter:ajaxlink>
									</div>
								</td>																
							</tr>
						</tbody>
				</winter:datatable>
				<winter:ajaxSubmit 
						id="VolverNotaButton"
						form="ControlesForm"
						url="@{'/controles/cancelar/NOTAS'}"
						update="ControlesOutput,ListaControles"
						value="#{label.operaciones.volver}"
						class="btn btn-cyan"
						object="controles"
						showstatus="true"
						confirmationrequired="false"
						confirmationtext="Esta seguro de que desea descartar los cambios realizados?"
						immediate="true">
					</winter:ajaxSubmit>
				<winter:output id="SeguimientoModalOutput">
				   	<div id="NuevoSeguimientoContainer">
						<winter:dialog id="NotaModal" width="40%" height="auto" title="@{'Nota'}" resizable="true" contentClass="dialog-form" effect="fade-and-scale">
							<winter:output id="NotasGestionOutput">
								<div id="NotasGestionInclude" th:include="/admin/controlNotaDialog :: NotasGestionFragment">
								</div>
							</winter:output>
						</winter:dialog>
					</div>
				</winter:output>
			</winter:output>
		</winter:output>
	</div>
</html>